$(function(){
	// 内容提交
		$('form').submit(function(){
	  		// 序列号
	  		var formData = $(this).serialize();
	  		$.ajax({
	  				url: APP+'?a=a',
	  				type: 'post',
	  				dataType: 'json',
	  				data: formData,
	  				success:function(phpData){ 
	  					var arr = '';

	  					// var arr='<div class="box_ge" style="position: absolute;left:"'+phpData.left+'"px;top:"'+phpData.top+'"px;"><p class="name">呢称："'+phpData.name+'"</p><p class="box_nei">内容："'+phpData.value+'"</p></div>';
	  					arr += 	"<div class='box_ge'"+' style="position: absolute;background: url('+PUBLIC+'/pic/xw.png);';
	  					arr += 	"left:"+phpData.left+"px;"+"top:"+phpData.top+"px;"+'">';
	  					arr += 	'<p class="name">呢称：' +phpData.name+ "</p>";
	  					arr += 	 '<p class="box_nei">内容：'+phpData.value+"</p></div>";

	  					$('#box').append(arr);
	  					$('form')[0].reset();
	  					$('.box_ge').each(function(){
						// 获取页面最大可视区域宽高
							windowW = document.documentElement.clientWidth;
							windowH = document.documentElement.clientHeight;
							// 获取区块宽高
							blockW = parseInt(this.style.width);
							blockH = parseInt(this.style.height);

							// // 获取最大也移动宽高
							bigW = windowW - blockW -200;
							bigH = windowH - blockH -100;
							// alert(bigW);
							left= Math.floor(Math.random()*(bigW-50)+50);
							tops= Math.floor(Math.random()*(bigH-50)+50);
							this.style.left = left+'px';
							this.style.top = tops+'px';
							this.style.width = 50+'px';
							this.style.height = 50+'px';
							$('.box_ge').show();
						});

	  				}
	  			});		
		});
		
		// 留言内容
		$('#show').click(function() {

			// $('#form').addClass('form');
			$('#form').stop().animate({'top':'200px'}, 1000);
			$('.box_ge').animate({"left":'700px',"top":'170px','width':'10px','height':'10px'},2000).fadeOut('slow', function() {
				$('.box_ge').hide();
			});
			$('#hei').addClass('class');
				var t=0;
			$('#hei').stop().animate({'width':'500px','height':'500'}, 2000);
			 v = setInterval(function(){
				if(t<360){
					t+=5;
						var i = t;
					$('#hei').css({	'transform':'rotate('+i+'deg)',
				'-ms-transform':'rotate('+i+'deg)', 	/* IE 9 */
				'-moz-transform':('rotate('+i+'deg)'), 	/* Firefox */
				'-webkit-transform':'rotate('+i+'deg)', /* Safari 和 Chrome */
				'-o-transform':('rotate('+i+'deg)'), 	/* Opera */});

					}else{
						t=0;
				}	

			},5);

		});
		$('#show').click(function() {
			setTimeout(function(){
					$('#hei').removeClass('class');
					$('#hei').animate({"width":'200px',"height":'170px'},1000);
				},3000);	
		});



		// 取消
		$('#head').click(function() {
			
			$('#form').stop().animate({'top':'-100px'}, 1000);
			$('.box_ge').each(function(){
						// 获取页面最大可视区域宽高
							windowW = document.documentElement.clientWidth;
							windowH = document.documentElement.clientHeight;
							// 获取区块宽高
							blockW = parseInt(this.style.width);
							blockH = parseInt(this.style.height);

							// // 获取最大也移动宽高
							bigW = windowW - blockW -200;
							bigH = windowH - blockH -100;
							// alert(bigW);
							left= Math.floor(Math.random()*(bigW-50)+50);
							tops= Math.floor(Math.random()*(bigH-50)+50);
							this.style.left = left+'px';
							this.style.top = tops+'px';
							this.style.width = 50+'px';
							this.style.height = 50+'px';
							$('.box_ge').show();
						});
		});
		// 添加
		$('.submit').click(function() {
			
			$('#form').css({'top':'-100px'});
		});

		// 转
				var a=0;
		setInterval(function(){
			
			if(a<360){
				a+=0.2;
				var i = a;
			$('.box_ge').css({	'transform':'rotate('+i+'deg)',
		'-ms-transform':'rotate('+i+'deg)', 	/* IE 9 */
		'-moz-transform':('rotate('+i+'deg)'), 	/* Firefox */
		'-webkit-transform':'rotate('+i+'deg)', /* Safari 和 Chrome */
		'-o-transform':('rotate('+i+'deg)'), 	/* Opera */})
			}else{
				a=0;
			}	
		},5);

		

				// 抓内容
		$('.box_ge').hover(function(){
			$('.shownei').stop().animate({'left':'0px'}, 1000);
			// var p = $(this).html();
			var num =$(this).index();
			// alert($('.box_ge').eq(num).find('.name').html());
			tit=$('.box_ge').eq(num).find('.name').html();
			cont= $('.box_ge').eq(num).find('.box_nei').html();
			$('.showtop').html(tit);
			$('.showleft').html(cont);
			



		},function(){
			$('.shownei').stop().animate({'left':'-200px'}, 1000);
		});






})